<template>
    <j-modal
      :title="title"
      :width="800"
      :visible="visible"
      :maskClosable="false"
      :keyboard="false"
      :forceRender="true"
      @cancel="handleCancel"
      wrapClassName="ant-modal-cust-warp"
      style="top:5%;height: 100%;overflow-y: hidden">
      <template slot="footer">
        <a-button key="back" v-if="isReadOnly" @click="handleCancel">
          取消
        </a-button> 
        <a-button v-print="'#retailOutPrint'">打印</a-button>
        <a-button key="back" @click="handleCancel">关闭</a-button>
      </template>

      <a-spin :spinning="confirmLoading" style="margin-bottom: 100px;" class="contract" >
        <div ref="print" id="retailOutPrint">
          <table border="1" style="width:98%;text-align: center;">
            <tr>
              <td colspan="15" style="height:80px;font-size: 25px;border: none;position: relative;">
                【驰恒品牌】业务合同
                <span style="position: absolute;font-size:13px;left:100%;top:100%;transform: translate(-110%,-100%);width: max-content">
                  {{ model.odd }}
                </span>
              </td>
            </tr>
            <tr>
              <td width="10%">门店名称</td>
              <td width="10%">{{ model.storeName }}</td>
              <td width="7%">业务类型</td>
              <td width="7%">{{ model.type }}</td>
              <td width="15%" colspan="2">地址</td>
              <td width="35%" colspan="15">{{ model.address }}</td>
            </tr>
            <tr>
              <td rowspan="2">客户信息</td>
              <td>姓名</td>
              <td>{{ model.name }}</td>
              <td colspan="3">电话：(重要)</td>
              <td colspan="10">{{ model.tel }}</td>
            </tr>
            <tr>
              <td>身份证号</td>
              <td colspan="15">{{ model.idNumber }}</td>
            </tr>
            <tr>
              <td rowspan="2" width="10%">序号</td>
              <td rowspan="2" width="15%">寄卖物名称</td>
              <td rowspan="2" width="20%">规格状况</td>
              <td rowspan="2" width="8%">数量</td>
              <td rowspan="2" width="12%">寄卖价格</td>
              <td width="35%" colspan="10">价值</td>
            </tr>
            <tr>
              <td width="3.9%" v-for="(item, index) in money_text" :key="index">{{ item }}</td>
            </tr>
            <tr v-for="(item,index) in model.itemList" :key="index">
              <td>{{ index + 1 }}</td>
              <td>{{ item.category }}</td>
              <td>{{ item.brandWeight }}</td>
              <td>{{ item.amount }}</td>
              <td>{{ item.depositAmount }}</td>
              <td v-for="(i,ind) in item.value" :key="ind">{{ i }}</td>
            </tr>
            
            <tr>
              <td>到期时间</td>
              <td colspan="2">{{ model.endTime }}</td>
              <td colspan="11">服务费 小写：{{ model.profit }}</td>
              <!-- <td colspan="3"> %</td> -->
            </tr>
          </table>
          <div style="padding:0 20px;box-sizing: border-box;margin-top:10px;">
            <!-- <div style="display: flex;justify-content: space-between;">
              <div>业务员：刘杰</div>
              <div>
                  年&emsp;&emsp;月&emsp;&emsp;日
              </div>
            </div>
            <div style="text-align: end;margin-top:10px;">{{ model.rate }}</div> -->

            <div style="display: flex;justify-content: space-between;align-items: center;">
              <div>

                业务员：{{ model.ope }}
              </div>
              <div>
                20&emsp;年&emsp;&emsp;月&emsp;&emsp;日&emsp;&emsp;时&emsp;&emsp;分
              </div>
            </div>
           </div>
          <div style="padding:0 10px;box-sizing: border-box;">
            <div style="text-align: center;margin:10px 0 5px 0;font-size: 20px">特别约定</div>
            <div>
              一、价值是指:双方寄物品所值价格的共同认定。<br/>
              二、寄卖价格是指:寄卖人确定的寄卖物品出售的价格，但寄卖人有权随时进行调整。<br/>
              三、服务费是指:寄卖人支付寄卖行产生的固定费用(无论是否卖出)。寄卖人超过寄卖期限继续支付服务费视为寄卖期限的延长。<br/>
              四、寄卖行有义务将寄卖业务的相关情况通过微信、短信及时通知寄卖人，寄卖人3日内未回复的视为默认同意寄卖行通知的内容。<br/>
              五、因寄卖物品灭失或损坏的，寄卖行在寄卖物品的认定价值范围内赔偿。<br/>
              六、寄卖人承诺:寄卖物品属于寄卖人所有的合法财物。<br/>
              七、本合同一式两份，双方各执一份。<br/>
              八、我__________承诺言而有信;不能按时履约也会提前沟通，绝不出现联系不上等情况<br/>
              逾期7天不联系、不处理视为主动放弃且转让该业务单据所载明物品的一切权利给驰恒24小时寄卖行。<br/>
              九、其他约定：_____________________________________________________________________________________________________</div>
            <div style="margin:20px 0;display: flex;justify-content: space-between;font-weight: bold;">
              <div>寄卖行（签单）：驰恒金融24小时寄卖行</div>
              <div>寄卖人（签字或按手印）：&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;</div>
            </div>
            <div style="text-align: center;margin-top: 30px;font-weight: bold">
              24小时客服电话:15586008000
            </div>
          </div>
        </div>
      </a-spin>
    </j-modal>
</template>
<script>
  import pick from 'lodash.pick'
  import Vue from 'vue'
  import { ACCESS_TOKEN } from "@/store/mutation-types"
//   import { aImage } from 'ant-design-vue'
  import JUpload from '@/components/jeecg/JUpload'
  import JImageUpload from '@/components/jeecg/JImageUpload'
import { getAction } from '../../../api/manage'
  export default {
    name: 'EngineerProduceDetail',
    components: {
      // aImage,
      JImageUpload,
      JUpload
    },
    data () {
      return {
        title:"详情",
        visible: false,
        isReadOnly: false,
        modalWidth:600,
        drawerWidth:600,
        money_text:['百','十','万','千','百','十','元','角','分'],
        model: {},
        fileList: [],
        labelCol: {
          xs: { span: 24 },
          sm: { span: 6 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        form: this.$form.createForm(this),
        uploadLoading:false,
        confirmLoading: false,
        headers:{},
        dataSource: [],
      }
    },
    created () {
      const token = Vue.ls.get(ACCESS_TOKEN);
      this.headers = {"X-Access-Token":token}
    },
    methods: {
      show(record,url) {
        //附件下载
        // this.fileList = record.fileName
        if(JSON.stringify(record) === '{}') {
          this.fileList = []
        } else {
          setTimeout(() => {
            this.fileList = record.fileName
          }, 5)
        }
        let params = {
            businessId : record.id
        }
        getAction(url,params).then(res=>{
            if(res.code !== 200)
              return 
              console.log(res,'res');
            this.visible = true;
            this.$nextTick(() => {
                  if(res.data.endTime != null || res.data.endTime != undefined){
                    res.data.endTime = new Date(res.data.endTime).toLocaleDateString();
                  }
                  if(res.data.createTimeStr != null || res.data.createTimeStr != undefined){
                    res.data.time = separateTime(res.data.createTimeStr);
                    res.data.createTimeStr = separateDate(res.data.createTimeStr);
                  }
              this.model = Object.assign({}, res.data);
              // this.form.setFieldsValue(pick(this.model,'source','odd','date','time','name','createTimeStr','tel','idNumber','address','type','category','level','amount','brandWeight','depositAmount','recyclePrice','recycleTotal','deliveryPrice','status','feedback','rate','nameB','endTime','reminder','remark','fundSource','fileName'))
              // 按位取(9位，多余补零)
              let caps = ['零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖']
              let fn2 = (item)=>{
                // 首先拿出小数位
                if(item.split('.').length >= 2){
                  let arr2 = item.split('.')[1].split('')
                  if(arr2.length <= 1){
                    arr2.push('0')
                  }
                  while(arr2.length > 2){
                    arr2.pop()
                  }
                  item = [...item.split('.')[0].split(''), ...arr2]
                }else{
                  item = [...item.split(''), '0','0']
                }
                while(item.length <= 8){
                  item.unshift('0')
                }
                // 开始遍历然后将数字大写
                item.forEach((num,index) => {
                  if(num !== '0' && num !== 0){
                    item[index] = caps[num]
                  }
                })
                return item
              }
              let fn = (item) =>{
                let result = []
                let convert_int = (item)=>{
                  let money_reverse = Object.assign([],this.money_text)
                  money_reverse.reverse()
                  money_reverse.shift()
                  money_reverse.shift()
                  let arr =item.split('').reverse()
                  arr.forEach((item,index) =>{
                    if((item == '0' || item == 0)){
                      if(result[result.length - 1] != '零')
                          result.push('零')
                      return
                    }
                    if(money_reverse[index-1] == '万' && (arr[index - 1] == 0 || arr[index - 1] == '0')){
                      result.push(caps[item] + money_reverse[index] + '万')
                    }else if(money_reverse[index-1] == '万' && (arr[index - 1] != 0 || arr[index - 1] != '0')){
                      result[result.length -1] = caps[item] + money_reverse[index] + result[result.length -1]
                    }
                    else{
                      result.push(caps[item] + money_reverse[index])
                    }
                  })
                  if(result[0] == '零'){
                    result.shift()
                  }
                  result = result.reverse().join('')
                }
                let convert_float = (item)=>{
                  item = item.split('')
                  if(item.length <= 1)
                    item.push('0')                  
                  Array('角','分').forEach((i, index) =>{
                    if((item[index] == 0 || item[index] == '0')){
                      if(index == 1)
                        return
                      result += '零'
                    }else
                      result += caps[item[index]] + i
                  })
                }
                let i = item.split('.')
                if(i.length <= 1){
                  convert_int(i[0]);
                  if(result.substring(result.length,result.length-1) == '元')
                    result += '整'
                  else
                    result += '元整'
                }else{
                  convert_int(i[0]);
                  convert_float(i[1]);
                }
                return result
              }
              if(this.model.deliveryPrice !== null)
                this.model.deliveryPrice2 = fn(this.model.deliveryPrice)
              // if(this.model.profit !== null)
                // this.model.profit2 = fn(this.model.profit)
              this.model.itemList.forEach(item => {
                if(this.model.type == '寄存'){
                  item.value = fn2(item.depositAmount)
                }else if(this.model.type == '回收'){
                  item.depositAmount = item.recycleTotal
                  item.value = fn2(item.recycleTotal)
                }else{
                  item.depositAmount = item.recycleTotal
                  item.value = fn2(item.recycleTotal)
                }
              })
            });
        })
      },

      handleCancel() {
        this.close()
      },
      close() {
        this.$emit('close');
        this.visible = false;
      }
    }
  }
</script>

<style lang="less" scoped>
.contract{
  font-family: '仿宋';
  font-weight: bold;
}
td,th{
  height:50px;
  font-weight: bold;
}
@import "chart";
</style>